import { createBrowserRouter } from 'react-router-dom'
import Home from '../pages/Home'
import List from '../pages/List'
import Xq from '../pages/Xq'
import Zf from '../pages/Zf'
import Login from '../pages/Login'
import Error from '../pages/404'

const router = createBrowserRouter([
    {
        path: '/',
        element: <Home></Home>
    },
    {
        path: '/home',
        // element: <Home></Home>
        lazy: async () => {
            const { default: Home } = await import('../pages/Home')
            return {
                element: <Home></Home>
            }
        }
    },
    {
        path: '/list',
        // element: <List></List>
        lazy: async () => {
            const { default: List,loader } = await import('../pages/List')
            return {
                element: <List></List>,
                loader
            }
        }
    },
    {
        path: '/my',
        // element: <List></List>
        lazy: async () => {
            const { default: My } = await import('../pages/My')
            return {
                element: <My></My>
            }
        }
    },
    {
        path: '/login',
        // element: <Login></Login>
        lazy: async () => {
            const { default: Login } = await import('../pages/Login')
            return {
                element: <Login></Login>
            }
        }
    },
    {
        path: '/xq/:id',
        // element: <Xq></Xq>
        lazy: async () => {
            const { default: Xq,loader } = await import('../pages/Xq')
            return {
                element: <Xq></Xq>,
                loader
            }
        }
    },
    {
        path: '/zf',
        // element: <Zf></Zf>
        lazy: async () => {
            const { default: Zf } = await import('../pages/Zf')
            return {
                element: <Zf></Zf>
            }
        }
    },
    {
        path: '*',
        // element: <Error></Error>
        lazy: async () => {
            const { default: Error } = await import('../pages/404')
            return {
                element: <Error></Error>
            }
        }
    },
])
export default router